import { toValue, onUnmounted } from "vue";
import Draw from "ol/interaction/Draw";
import { Vector as VectorSource } from "ol/source";

export default function useDrawPoint(map, source, onDrawEnd = () => {}) {
  const _map = toValue(map);
  const _source = toValue(source) || new VectorSource();

  const draw = new Draw({
    source: _source,
    type: "Point",
  });

  _map.addInteraction(draw);

  draw.on("drawend", e => {
    onDrawEnd(e);
  });

  function removeDraw() {
    _map.removeInteraction(draw);
  }

  onUnmounted(() => {
    removeDraw();
  });

  return {
    source: _source,
    draw,
    remove: removeDraw,
  };
}
